<%--
    Document   : consultarAsistencia
    Created on : 17/11/2010, 10:36:19 AM
    Author     : yngrdyn
--%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<%@ include file='../Templates/security.jsp' %>

<script type="text/javascript">
    var ci="";
    var fechaDesde = "";
    var fechaHasta = "";
    var sede = "";
    var voe = "V";

    function consultarCambio(){
        $.getJSON("consultarCambioGuardia.do",{ci: ci, fechaDesde: fechaDesde,
                fechaHasta: fechaHasta,sede: sede,voe:voe},
            function(data){
            $('#result').empty();
            $.each(data.listaCambiosGuardia, function(i,item){
                var string =
                    "<tr><td>"+item.fecha_guardia+"</td>"+
                    "<td>"+item.ci+"</td>"+
                    "<td>"+item.nombre_1+"</td>"+
                    "<td>"+item.apellido_1+"</td>"+
                    "<td>"+item.ci_reemplazo+"</td>"+
                    "<td>"+item.autorizado_por+"</td></tr>";
                $('#result').append(string);
            });
        });
    }

    function setCi(idCi){
        ci = idCi;
        //consultarAsist();
    }

    function setFechaDesde(fechaD){
        fechaDesde = fechaD;
    }

    function setFechaHasta(fechaH){
        fechaHasta = fechaH;
    }

    function setSede(sedeU){
        sede = sedeU;
    }

    function setVoe(voeN){
        voe = voeN;
    }

    $(function(){
        $('#fechaD').datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date(),
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
    });

    $(function(){
        $('#fechaH').datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date(),
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
        listaSedes();
    });
</script>

<h1 class="title">Gestión de Cambios de Guardia</h1>
<hr>
<br>
<center>
    <h2>Consultar Cambios de Guardia</h2>
<table cellspacing="5" >
    <tr>
        <td>C&eacute;dula del empleado:</td>
        <td>

                <select name="voe" id="voe" onchange="setVoe(value)">
                    <option value="V">V</option>
                    <option value="E">E</option>
                </select>
            &nbsp;-&nbsp;
            <input type="text" name="ci" size="17" maxlength="12"
                   id="ciAsist" onchange="setCi(value)"/>
        </td>
    </tr>
    <tr>
        <td>Desde:</td>
        <td>
            <input type="text" name="fechaDesde" size="25" maxlength="10"
                   id="fechaD" onchange="setFechaDesde(value)">
        </td>
    </tr>
    <tr>
        <td>Hasta:</td>
        <td>
            <input type="text" name="fechaHasta" size="25" maxlength="10"
                   id="fechaH" onchange="setFechaHasta(value)">
        </td>
    </tr>
    <tr>
        <td>Sede:</td>
        <td>
            <select id="Sedes" name="sede" onchange="setSede(value)" ></select>
        </td>
    </tr>
</table>
<br>
<input type="button" value="Buscar" onclick="consultarCambio()"/>
</center>

<br>
<center>
    <table id="table" class="sortable">
        <thead align="center" >
            <tr>
                <th>Fecha</th>
                <th>C&eacute;dula</th>
                <th>Nombre</th>
                <th>Apellido</th>
                <th>Reemplazo</th>
                <th>Autorizado por</th>
                <th></th>
            </tr>
        </thead>
        <tbody id="result">

        </tbody>
    </table>

</center>
